<template>
  <div id="app">
    <Item :carItem="itemList"></Item>
    <br>
    <to-do-item v-for="item in list" :key="item" :item="item">
      <span style="font-size:20px">{{ item }}</span>
    </to-do-item>
    <input v-model="value" type="text"/>
    <el-button type="primary" @click="addList">获取值</el-button>
    <!-- <img alt="Vue logo" src="./assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js App"/> -->
    <Student :age="28" name="小明" sex="男"></Student>
    <input id="" v-model="obj.sel" name="" type="text"/>
    <select v-model="obj.sel">
      <option value="bj">北京</option>
      <option value="sh">上海</option>
    </select>

    <br/>
    <Sel ref="selChild"></Sel>
    <el-button type="primary" @click="getLableFather">父获取值</el-button>
  </div>
</template>

<script>
// import HelloWorld from './components/HelloWorld.vue'
import Student from "./components/Student.vue";
import Sel from "./components/sel.vue";
import ToDoItem from "./components/ToDoItem.vue";
import Item from './components/Item.vue'

export default {
  name: "App",
  components: {
    // HelloWorld
    Student,
    Sel,
    ToDoItem,
    Item
  },
  data() {
    return {
      obj: {
        sel: "bj",
      },
      myAge: this.age,
      list: [],
      value: "",
      itemList: [234, 266, 273]
    };
  },
  methods: {
    addList() {
      this.list.push(this.value);
      this.itemList.push(this.value)
      console.log(this.itemList)
      this.value = "";
    },
    getLableFather() {
      console.log('refs', this.$refs)
      let selectedLable = this.$refs.selChild.getLable();
      console.log("选择的lable", selectedLable);
    },
  },
  watch: {
    "obj.sel": {
      handler(newName, oldName) {
        console.log("obj.a changed");
        console.log(newName, oldName);
      },
    },
  },
};
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}

/* 注释 */
</style>
